<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page isELIgnored="false" %>
<html>
<head>
    <title>Title</title>
    <link href="css/addMusic/css.css" rel="stylesheet">
    <script src="js/addMusic/modernizr.js"></script>
    <script type="text/javascript" src="js/addMusic/jquery.1.11.3.min.js"></script>
    <script type="text/javascript" src="js/addMusic/ajaxfileupload1.1.js"></script>
</head>
<body style="padding-top: 0px;">
<h3 style="text-align: center">添加新曲</h3>
<div class="container body-content">
    <br>
    <div class="form-horizontal">
        <form action="${pageContext.request.contextPath}/music?method=upLoadSong" method="post" enctype="multipart/form-data">
            <%--              enctype="multipart/form-data">--%>
            <div class="form-group">
                <label class="col-sm-2 control-label">歌曲名</label>
                <div class="col-sm-10">
                    <input class="form-control" id="muName" name="muName" type="text" style="width: 300px">
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-2 control-label">歌手</label>
                <div class="col-sm-10">
                    <input class="form-control" id="muSinger" name="muSinger" type="text" style="width: 300px">
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-2 control-label">上传歌曲:</label>
                <%--            <input id="FileUpload" name="FileUpload" type="file" style="display:none">--%>
                <%--            <input id="FileUpload2" name="FileUpload2" type="file" style="display:none">--%>
                <div class="col-sm-10" style="margin-bottom: 20px">
                    <div class="form_div1">
                        <input id="photoCover" class="input-large" type="text" style="height:30px;">
                        <input name="mp3" type="file" id="ipt">
                    </div>
                </div>
                <label class="col-sm-2 control-label" >上传封面：</label>
                <div class="col-sm-10" style="margin-bottom: 20px">
                    <div class="form_div2">
                        <input id="photoCover2" class="input-large" type="text" style="height:30px;">
                        <input id="km_head" type="file" name="img">
                    </div>
                </div>
                <div class="form-group">
                    <label class="col-sm-2 control-label">歌词</label>
                    <%--&nbsp;&nbsp;&nbsp;&nbsp;<input id="muGeci" class="input-large" type="text" style="height:30px;">--%>
                    <%--<div class="btn btn-primary btn-sm" onclick="$('input[id=FileUpload2]').click();">选择歌词</div>--%>
                    <div class="col-sm-10">
                        <textarea class="form-control" id="muGeci" name="muGeci" rows="5"></textarea>
                    </div>
                </div>
                <div class="form-group">
                    <div class="col-sm-offset-2 col-sm-10">
                        <input class="btn btn-default" id="btnSave" type="submit" value="上传文件">
                    </div>
                </div>
        </form>
        <div class="form-group"></div>

        <script type="text/javascript">
            $(document).ready(function () {
                $("#btnSave").click(function () {
                    ajaxFileUpload();
                });
            });
            $('#ipt').change(function () {
                $('#photoCover').val($(this).val());
            });
            $('#km_head').change(function () {
                $('#photoCover2').val($(this).val());
            });

            function ajaxFileUpload() {
                var files = $('#ipt').prop('files');//获取到文件列表
                var files2 = $('#km_head').prop('files');//获取到文件列表

                if (files.length == 0 || files2.length == 0) {
                    alert('请选择文件');
                    return;
                } else {
                    $(this).prop("type", "submit");
                }
                // $.ajaxFileUpload(
                //     {
                //         type: "POST",
                //         url:"/music?method=upLoadSong",     //请求地址
                //         fileElementId: 'FileUpload',         //上传文件控件ID
                //         data: { "Name": $("#muName").val(), "Singer": $("#muSinger").val(), "GeCi": $("#muGeci").val() },
                //         dataType: 'text', //返回值类型 一般设置为json
                //         success: function (data)       //成功函数一个异常捕获一样
                //         {
                //             console.log(data);
                //             alert("成功");
                //             window.location.href = "/Home/Index";
                //         },
                //         //异常处理
                //         error: function (data, status, e) {
                //             alert("验证失败，请上传音乐文件！");
                //         }
                //     }
                // );
            }
        </script>

        <script src="js/bootstrap.min.js"></script>
</body>
</html>
